<template name="results">
	<view class="content">
		<view class="phone">
			<view class="phone-content">
				<uv-icon name="checkmark-circle-fill" color="#47c9a2" size="150"></uv-icon>
				<!-- <nut-icon name="Check"></nut-icon> -->
				<view class="success-text">下单成功</view>
				<uv-button text="查看订单详情" @click="toOrder" shape="circle" color="#e5e7eb"
					customTextStyle="color:#666"></uv-button>
			</view>
			<view class="oveRight" @click="toIndex">完成</view>
		</view>
		<goodsList :sell="true" ref="goodsListRef" />
	</view>
</template>

<script setup>
	import {
		ref,
	} from "vue";
	import {
		onLoad,
		onShow,
		onReachBottom
	} from '@dcloudio/uni-app'
	const order_no = ref(null)
	const app = getApp()
	onLoad((e) => {
		order_no.value = e?.order_no
		let sourcePath = e?.sourcePath
		if (sourcePath && sourcePath == "realperson") {
			setTimeout(() => {
				checkUser(order_no.value);
			}, 5000)
		} else {
			checkUser(order_no.value);
		}
	})
	const toIndex = () => {
		uni.switchTab({
			url: '/pages/index/index'
		})
	}

	const checkUser = (order_no) => {
		app.post('api.auth.center/isRealPerson').then(res => {
			if (!res.is_realperson) {
				toRealperson(order_no)
			}
		})
	}

	const toRealperson = (order_no) => {
		uni.navigateTo({
			url: '/pages/realperson/realperson?order_no=' + order_no,
		})
	}
	const toOrderList = () => {
		uni.redirectTo({
			url: '/pages/orderList/orderList'
		})
	}
	const toOrderDetail = (order_no) => {
		uni.redirectTo({
			url: '/pages/orderDetail/orderDetail?order_no=' + order_no,
		})
	}
	const toOrder = () => {
		if (order_no.value) {
			toOrderDetail(order_no.value)
		} else {
			toOrderList()
		}
	}
	onShow(() => {
		uni.pageScrollTo({
			scrollTop: 0
		})
	})
	const goodsListRef = ref(null)
	onReachBottom(() => {
		goodsListRef.value.getData()
	})
</script>

<style lang="scss" scoped>
	.content {
		padding: 10px;
		display: flex;
		flex-direction: column;
		gap: 10px;
	}

	.phone {
		width: -webkit-fill-available;
		//padding: 20px;
		//box-shadow: 0 4px 35px rgba(0, 0, 0, .1);
		background-color: inherit;
		border-radius: 10px;
		display: flex;
		flex-direction: column;
		z-index: 1;
		box-shadow: 0 4px 35px rgba(0, 0, 0, 0.1);

		.phone-content {
			display: grid;
			flex-direction: column;
			text-align: center;
			justify-content: center;
			align-items: center;
			width: 70%;
			gap: 10px;
			margin: 20px auto;

			::v-deep.nut-icon {
				position: relative;
				border-radius: 100%;
				width: 150px !important;
				height: 150px !important;
				background: #47c9a2;
				color: #e2feee;
				margin: auto;
				font-size: -webkit-xxx-large;
			}
		}
	}

	.success-text {
		font-size: larger;
		border-radius: 10px;
	}

	::v-deep.nut-button {
		background-color: #e5e7eb;
		border: none;
	}

	.oveRight {
		position: absolute;
		right: 10px;
		top: 10px;
		background-color: rgb(229 231 235);
		border-radius: 0 0 0 50%;
		height: 40px;
		line-height: 40px;
		width: 40px;
		text-align: center;
		padding: 0 4px;

		&:active {
			background-color: #f5f5f5;
		}
	}
</style>